<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>自主招生报名</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta name="viewport" content="width=device-width, user-scalable=no">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta name="apple-mobile-web-app-status-bar-style" content="default"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
    <meta content="telephone=no" name="format-detection">
    <meta content="email=no" name="format-detection">
    <meta name="format-detection" content="telephone=no"/>
    <link href="${s.base}/mobile/css/weui.min.css" rel="stylesheet" />
    <link href="${s.base}/mobile/css/jquery-weui.css" rel="stylesheet"/>
    <link href="${s.base}/mobile/css/jquery-weui.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="${s.base}/mobile/css/enrollment/zzzs.css"/>
</head>
<style>
    .weui-picker-overlay, .weui-picker-container{ height:100%; background:rgba(0,0,0,0.05)}
</style>
<body style="background:#f1f1f1;">
<div class="main-content75" >
    <div class="data-entry-ctn">
        <div class="data-entry-title data-entry-title-bg">基本信息</div>
        <div class="div-input-line">
            <label><span class="red">*</span>姓名</label>
            <input id="name" type="text" value="${infoName}" placeholder="请输入" />
        </div>
        <div class="div-input-line">
            <label><span class="red">*</span>性别</label>
            <input type="text" value="${infoGender}" data-value="${infoGenderValue}" id="gender" placeholder="请选择" />
            <div class="div-right-ft"></div>
        </div>
        <div class="div-input-line">
            <label>政治面貌</label>
            <input type="text" value="${infoPoliticalStatus}" data-value="${infoPoliticalStatusValue}" id="politicalStatus" placeholder="请选择" />
            <div class="div-right-ft"></div>
        </div>
        <div class="div-input-line">
            <label>民族</label>
            <input type="text" value="${infoNationality}" data-value="${infoNationalityValue}" id="nationality" placeholder="请选择" />
            <div class="div-right-ft"></div>
        </div>
        <div class="div-input-line">
            <label>户口类型</label>
            <input type="text" value="${infoAccountType}" data-value="${infoAccountTypeValue}" id="accountType" placeholder="请选择" />
            <div class="div-right-ft"></div>
        </div>
        <div class="div-input-line">
            <label><span class="red">*</span>联系电话</label>
            <input id="phonenum" type="number" value="${infoPhonenum}" placeholder="请选择" />
        </div>
        <div class="div-input-line">
            <label><span class="red">*</span>身份证号码</label>
            <input id="cardnum" type="number" value="${infoCardnum}" placeholder="请选择" />
        </div>
    </div>
    <div class="zzzs-btn-ctn mart40">
        <button type="button" onclick="prePage()">上一步</button>
        <button type="button" onclick="nextPage()">下一步</button>
    </div>
</div>
</body>
<script type="text/javascript" src="${s.base}/mobile/js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="${s.base}/mobile/js/jquery-weui.js"></script>
<script type="text/javascript" src="${s.base}/mobile/js/fontSize.js"></script>
<script type="text/javascript" src="${s.base}/mobile/js/common.js"></script>
<script type="text/javascript">
    var genderList = JSON.parse('${genderList}');
    var politicalStatusList = JSON.parse('${politicalStatusList}');
    var nationalityList = JSON.parse('${nationalityList}');
    var accountTypeList = JSON.parse('${accountTypeList}');

    $(function () {
        initListener(genderList,politicalStatusList,nationalityList,accountTypeList);
    });

    function initListener(genderList,politicalStatusList,nationalityList,accountTypeList) {
        $("#gender").select({
            title: "选择性别",
            items: genderList,
            closeText:"关闭",
            onChange: function(d) {
                console.log(this, d);
            },
            onClose: function(d) {
                $("#gender").attr("data-value",d.data.values);
            },
            onOpen: function() {
                console.log("open");
            },
        });
        $("#politicalStatus").select({
            title: "请选择",
            items: politicalStatusList,
            closeText:"关闭",
            onChange: function(d) {
                console.log(this, d);
            },
            onClose: function(d) {
                $("#politicalStatus").attr("data-value",d.data.values);
            },
            onOpen: function() {
                console.log("open");
            },
        });
        $("#nationality").select({
            title: "选择民族",
            items: nationalityList,
            closeText:"关闭",
            onChange: function(d) {
                console.log(this, d);
            },
            onClose: function(d) {
                $("#nationality").attr("data-value",d.data.values);
            },
            onOpen: function() {
                console.log("open");
            },
        });

        $("#accountType").select({
            title: "选择户口类型",
            items: accountTypeList,
            closeText:"关闭",
            onChange: function(d) {
                console.log(this, d);
            },
            onClose: function(d) {
                $("#accountType").attr("data-value",d.data.values);
            },
            onOpen: function() {
                console.log("open");
            },
        });
    }


    function nextPage() {
        var name = $("#name").val();
        if(name == null || name == ""){
            $.toast("姓名不能为空", "text");
            return;
        }

        var gender = $("#gender").val();
        var genderValue = $("#gender").attr("data-value");
        if(gender == null || gender == ""){
            $.toast("请选择性别", "text");
            return;
        }

        var politicalStatus = $("#politicalStatus").val();
        var politicalStatusValue = $("#politicalStatus").attr("data-value");

        var nationality = $("#nationality").val();
        var nationalityValue = $("#nationality").attr("data-value");

        var accountType = $("#accountType").val();
        var accountTypeValue = $("#accountType").attr("data-value");

        var phonenum = $("#phonenum").val();
        if(phonenum == null || phonenum == ""){
            $.toast("联系电话不能为空", "text");
            return;
        }

        var regPhone = /^[1][3,4,5,7,8][0-9]{9}$/;
        if (!regPhone.test(phonenum)) {
            $.toast("请输入正确的手机号码", "text");
            return false;
        }

        var cardnum = $("#cardnum").val();
        if(cardnum == null || cardnum == ""){
            $.toast("身份证号码不能为空", "text");
            return;
        }

        var regCard = /(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}[0-9Xx]$)/;
        if (!regCard.test(cardnum)) {
            $.toast("请输入正确的身份证号码", "text");
            return false;
        }

        console.log("genderValue=="+genderValue);
        console.log("nationalityValue=="+nationalityValue);
        window.location.href = '/phone/enrollment/infoSchool?name='+name +
            '&gender='+gender +'&genderValue='+genderValue +
            '&politicalStatus='+politicalStatus +'&politicalStatusValue='+politicalStatusValue +
            '&nationality='+nationality +'&nationalityValue='+nationalityValue +
            '&accountType='+accountType +'&accountTypeValue='+accountTypeValue +
            '&phonenum='+phonenum +'&cardnum='+cardnum +
            '&releaseId=${releaseId}&token=${token}&applyId=${applyId}';
    }

    function prePage() {
        window.location.href = '/phone/enrollment/infoPhoto?releaseId=${releaseId}&token=${token}&applyId=${applyId}';
    }
</script>
</html>
